<template>
  <div class="article">
    <h2 class="title" v-text="article.title"></h2>
    <div class="meta_content">
      <em class="meta_text">2017-10-24</em>
      <!--<em class="meta_text">最美</em>-->
      <span class="author meta_text" v-text="article.author"></span>
    </div>
    <div class="content" v-html="article.content"></div>
  </div>
</template>

<script>
  import {get} from '@/api/api'

  export default {
    data () {
      return {
        article: {
          title: '',
          content: '',
          img: '',
          orderNumber: 0,
          status: 1,
          type: 1,
          viewCount: 0
        }
      }
    },
    methods: {
      init () {
        let id = this.$route.params.id
        get({
          url: '/admin/article/getArticleForId',
          data: {id: id},
          success: data => {
            this.article = data.data
            document.title = data.data.title
          },
          error: data => {
          }
        })
      }
    },
    mounted () {
      this.init()
    }
  }
</script>

<style scoped lang="scss">
  .article {
    padding: 20px 15px 15px;
    .title {
      margin: 0 0 10px 0;
      line-height: 1.4;
      font-weight: 400;
      font-size: 23px;
    }
    .meta_content {
      font-size: 14px;
      margin-bottom: 10px;
      em {
        font-style: normal;
        margin-bottom: 10px;
      }
      .span {
        margin-bottom: 10px;
      }
      .meta_text {
        color: #8c8c8c;
      }
    }
    .content {
      overflow: hidden;
      color: #3e3e3e;
      font-size: 15px;
      p {
        /*font-size: 14px;*/
      }
    }
  }
</style>
